import React from 'react';
import { Toast } from 'antd-mobile';
import Topbar from '../../components/Topbar/Topbar';
import Say from '../../components/Say/Say'
import Bottombar from '../../components/Bottombar/Bottombar'
import axios from 'axios';

class Mysay extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            data: [],
            userid:localStorage.getItem('userid'),
        };
    }

    async componentDidMount() {
        await axios.get(`https://www.prebeauty.work/saying/userid=${this.state.userid}`)
            .then((res) => {
                this.setState({
                    data: res.data
                })
                console.log(this.state.data)
            })
            .catch((err) => {
                console.log(err);
            })
    }

    goadd() {
        this.props.history.push('/Sharefabu')
    }

    render() {
        return (
            <div className="Share">
                <Topbar name="我的发布" color="#95D2AA" />
                {
                (this.state.data.length == 0) ? <div style={{minHeight:'510px',paddingTop:'70px',fontSize:'19px'}}>你还没有发布动态，快去发布动态加入我们吧！</div> :
                    <div style={{minHeight:'580px'}}>
                        {
                        this.state.data.map((item, index) => {
                            return (
                                <div
                                    key={index}
                                    >
                                    <div style={{width:'100%',height:'20px',backgroundColor:'white',fontSize:'20px'}}
                                        onClick={async()=>{
                                            await fetch(`https://www.prebeauty.work/saying/${item.sayid}`,{
                                                method:'DELETE',
                                                headers:{
                                                    'content-type': 'application/json'
                                                }
                                            }).then((res)=>{
                                                if(res.status===200){
                                                    res.json().then((data)=> {
                                                        Toast.success('成功删除动态')
                                                 
                                                    })
                                                }else {
                                                    console.log('erro')
                                                }
                                            })

                                            await axios.get(`https://www.prebeauty.work/saying/userid=${this.state.userid}`)
                                            .then((res) => {
                                                this.setState({
                                                    data: res.data
                                                })
                                                console.log(this.state.data)
                                            })
                                            .catch((err) => {
                                                console.log(err);
                                            })
                                        }}>
                                        <div style={{marginLeft:'90%'}}>×</div>
                                    </div>
                                    <Say 
                                        key={index}
                                        name={item.name} 
                                        time={item.time} 
                                        title={item.title}
                                        content={item.jianjie}
                                        imgsrc={item.imgsrc} 
                                        likenum={item.likenum} 
                                        commentnum={item.commentnum}
                                        sayid={item.sayid}
                                        userid={item.userid}
                                    />
                                </div>
                            )
                        })
                        }
                    </div>
                }
             
                {/* 页尾 */}
                <Bottombar />
            </div>
        )
    }
}

export default Mysay